<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<jsp:include page="logincheck.jsp" />
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>User Details</title>
    </head>
    <body>
        <h3>General Account Settings</h3>
        <s:form action = "updatedetails">
            <div id="table">
                <table border="0">
                    <tr><td></td><td></td></tr>
                </table>
            </div>
            <div id="personal">
                <table border="1">
                    <tr>
                        <td>Personal Details:</td>
                        <td></td>
                    </tr>
                    <tr>
                        <td>Username:</td>
                        <td><s:property value="customer.username"/></td>
                    </tr>
                    <tr>
                        <td>Full Name:</td>
                        <td><s:property value="customer.fname"/> <s:property value="customer.middle"/> <s:property value="customer.lname"/></td>
                    </tr>
                    <tr>
                        <td>Email:</td>
                        <td><s:property value="customer.email"/></td>
                    </tr>
                </table>
                <br>
                <s:submit name="editpersonal" value="Edit Fields" onclick="personaledit(); return false;" align="left"/>
            </div>
            <div id="personaledit">
                <table border="1">
                    <tr>
                        <td>Personal Details:</td>
                        <td></td>
                    </tr>
                    <tr>
                        <td><s:textfield name="customer.username" label = "Username"/></td>
                    </tr>
                    <tr>
                        <td><s:password name="passwordcur" label = "Current Password"/>
                            <s:password name="password1" label = "New Password"/>
                            <s:password name="password2" label = "Retype New Password"/></td>
                    </tr>
                    <tr>
                        <td><s:textfield name="customer.fname" label="First Name"/>
                            <s:textfield name="customer.middle" label="Middle" size="1" maxlength="1"/>
                            <s:textfield name="customer.lname" label="Last Name"/>
                        </td>
                    </tr>
                    <tr>
                        <td><s:textfield name="customer.email" label="E-mail"/></td>
                    </tr>
                </table>
                <br>
                <s:submit action="personal" value="Update" align="left"/>
                <s:submit  name="cancelpersonaledit" value="Cancel" onclick="disablepersonaledit(); return false;" align="left"/>
            </div>
            <br>
            <div id="delivery">
                <table border="1">
                    <tr>
                        <td>Delivery Address:</td>
                        <td></td>
                    </tr>
                    <tr>
                        <td>House Number:</td>
                        <td><s:property value="customer.delivery.no"/></td>
                    </tr>
                    <tr>
                        <td>Street:</td>
                        <td><s:property value="customer.delivery.street"/></td>
                    </tr>
                    <tr>
                        <td>Subdivision:</td>
                        <td>
                            <s:if test="%{#customer.delivery.subdivision==''}">
                                N/A</s:if>
                            <s:else><s:property value="customer.delivery.subdivision" default="N/A"/></s:else></td>
                    </tr>
                    <tr>
                        <td>City:</td>
                        <td><s:property value="customer.delivery.city"/></td>
                    </tr>
                    <tr>
                        <td>Country:</td>
                        <td><s:property value="customer.delivery.country"/></td>
                    </tr>
                    <tr>
                        <td>Zip Code:</td>
                        <td><s:property value="customer.delivery.postal"/></td>
                    </tr>
                </table>
                <br>
                <s:submit  name="editdelivery" value="Edit Fields" onclick="deliveryedit(); return false;" align="left"/>
            </div>
            <div id="deliveryedit">
                <table border="1">
                    <tr>
                        <td>Delivery Address:</td>
                        <td></td>
                    </tr>
                    <tr>
                        <td><s:textfield name="customer.delivery.no" label="House Number" size="6"/></td>
                    </tr>
                    <tr>
                        <td><s:textfield name="customer.delivery.street" label="Street"/></td>
                    </tr>
                    <tr>
                        <td><s:textfield name="customer.delivery.subdivision" label="Subdivision"/></td>
                    </tr>
                    <tr>
                        <td><s:textfield name="customer.delivery.city" label="City"/></td>
                    </tr>
                    <tr>
                        <td><s:textfield name="customer.delivery.country" label="Country"/></td>
                    </tr>
                    <tr>
                        <td> <s:textfield name="customer.delivery.postal" label="Zip Code"/></td>
                    </tr>
                </table>
                <br>
                <s:submit action="delivery" value="Update" align="left"/>
                <s:submit  name="canceldeliveryedit" value="Cancel" onclick="disabledeliveryedit(); return false;" align="left"/>
            </div>
            <br>
            <div id="payment">
                <table border="1">
                    <tr>
                        <td>Payment Info:</td>
                        <td></td>
                    </tr>
                    <tr>
                        <td>Credit Number:</td>
                        <td><s:property value="customer.credit.num"/></td>
                    </tr>
                    <tr>
                        <td>Name on card:</td>
                        <td><s:property value="customer.credit.name"/></td>
                    </tr>
                    <tr>
                        <td>Card Issuer:</td>
                        <td>
                            <s:if test="%{#customer.credit.issuer=='1'}">
                                MasterCard</s:if>
                            <s:elseif test="%{#customer.credit.issuer=='2'}">
                                Visa
                            </s:elseif></td>
                    </tr>
                    <tr>
                        <td>Expiry Date:</td>
                        <td><s:property value="customer.credit.expdate"/></td>
                    </tr>
                </table>
                <br>
                <s:submit  name="editpayment" value="Edit Fields" onclick="paymentedit(); return false;" align="left"/>
            </div>
            <div id="paymentedit">
                <table border="1">
                    <tr>
                        <td>Payment Info:</td>
                        <td></td>
                    </tr>
                    <tr>
                        <td><s:password name="creditnocur" label = "Current Credit Number"/>
                            <s:password name="creditno1" label = "New Credit Number"/>
                            <s:password name="creditno2" label = "Retype New Credit Number"/></td>
                    </tr>
                    <tr>
                        <td><s:textfield name="customer.credit.name" label="Name on Card"/></td>
                    </tr>
                    <tr>
                        <td><s:textfield name="customer.credit.issuer" label="Card Issuer"/></td>
                    </tr>
                    <tr>
                        <td><s:textfield name="customer.credit.expdate" label="Expiry Date (mm/dd/yyyy)"/></td>
                    </tr>
                </table>
                <br>
                <s:submit action="payment" value="Update" align="left"/>
                <s:submit  name="cancelpaymentedit" value="Cancel" onclick="disablepaymentedit(); return false;" align="left"/>
            </div>
            <br>
            <div id="billing">
                <table border="1">
                    <tr>
                        <td>Billing Address:</td>
                        <td></td>
                    </tr>
                    <tr>
                        <td>House Number:</td>
                        <td><s:property value="customer.credit.billing.no"/></td>
                    </tr>
                    <tr>
                        <td>Street:</td>
                        <td><s:property value="customer.credit.billing.street"/></td>
                    </tr>
                    <tr>
                        <td>Subdivision:</td>
                        <td><s:if test="%{#customer.credit.billing.subdivision==''}">
                                N/A</s:if>
                            <s:else><s:property value="customer.credit.billing.subdivision" default="N/A"/></s:else></td>
                    </tr>
                    <tr>
                        <td>City:</td>
                        <td><s:property value="customer.credit.billing.city"/></td>
                    </tr>
                    <tr>
                        <td>Country:</td>
                        <td><s:property value="customer.credit.billing.country"/></td>
                    </tr>
                    <tr>
                        <td>Zip Code:</td>
                        <td><s:property value="customer.credit.billing.postal"/></td>
                    </tr>
                </table>
                <br>
                <s:submit  name="editbilling" value="Edit Fields" onclick="billingedit(); return false;" align="left"/>
            </div>
            <div id="billingedit">
                <table border="1">
                    <tr>
                        <td>Billing Address:</td>
                        <td></td>
                    </tr>
                    <tr>
                        <td><s:textfield name="customer.credit.billing.no" label="House Number"/></td>
                    </tr>
                    <tr>
                        <td><s:textfield name="customer.credit.billing.street" label="Street"/></td>
                    </tr>
                    <tr>
                        <td><s:textfield name="customer.credit.billing.subdivision" label="Subdivision"/></td>
                    </tr>
                    <tr>
                        <td><s:textfield name="customer.credit.billing.city" label="City"/></td>
                    </tr>
                    <tr>
                        <td><s:textfield name="customer.credit.billing.country" label="Country"/></td>
                    </tr>
                    <tr>
                        <td><s:textfield name="customer.credit.billing.postal" label="Zip Code"/></td>
                    </tr>
                </table>
                <br>
                <s:submit action="billing" value="Update" align="left"/>
                <s:submit  name="cancelbillingedit" value="Cancel" onclick="disablebillingedit(); return false;" align="left"/>
            </div>
        </s:form>
        <br><br>
        <a href="main.jsp">Go Back</a>
        <Script type ="text/javascript">
            document.getElementById("personaledit").style.display = "none";
            document.getElementById("deliveryedit").style.display = "none";
            document.getElementById("paymentedit").style.display = "none";
            document.getElementById("billingedit").style.display = "none";

            function personaledit()
            {
                document.getElementById("personaledit").style.display="block";
                document.getElementById("personal").style.display="none";
            }
			
            function disablepersonaledit()
            {
                document.getElementById("personal").style.display="block";
                document.getElementById("personaledit").style.display="none";
            }
			
            function deliveryedit()
            {
                document.getElementById("deliveryedit").style.display="block";
                document.getElementById("delivery").style.display="none";
            }
			
            function disabledeliveryedit()
            {
                document.getElementById("delivery").style.display="block";
                document.getElementById("deliveryedit").style.display="none";
            }
			
            function paymentedit()
            {
                document.getElementById("paymentedit").style.display="block";
                document.getElementById("payment").style.display="none";
            }
			
            function disablepaymentedit()
            {
                document.getElementById("payment").style.display="block";
                document.getElementById("paymentedit").style.display="none";
            }
			
            function billingedit()
            {
                document.getElementById("billingedit").style.display="block";
                document.getElementById("billing").style.display="none";
            }
			
            function disablebillingedit()
            {
                document.getElementById("billing").style.display="block";
                document.getElementById("billingedit").style.display="none";
            }
        </Script>
    </body>
</html>